<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="body">

            <h:form id="form" enctype="multipart/form-data">
                <br/>
                <div class="buttonAction" style="float: right; margin-right: 30px">
                    <p:button title="Editar" value="Editar"
                              styleClass="ui-priority-primary"
                              href="editaraforamento.xhtml?aforamentoID=#{managerEditarAforamento.aforamento.id}"
                              icon="ui-icon-pencil"/>
                </div>
                <h3 class="title">Visualizar Aforamento</h3>

                <p:growl id="messages" showDetail="false" autoUpdate="true"  /> 
                <p:panel id="aforamentoPanel" style="background: none; border: none;" 
                         styleClass="container_24 clearfix both ">
                    <h4 class="title">Dados Gerais</h4>

                    <p:outputLabel value="Nº carta" styleClass="grid_3" for="cartaNumero"/>
                    <p:inputText id="cartaNumero" styleClass="grid_3" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.cartaNumero}" />

                    <p:outputLabel value="Data da carta" styleClass="grid_4 alpha" for="cartaData"/>
                    <p:inputText id="cartaData" value="#{managerEditarAforamento.aforamento.cartaData}" 
                                 readonly="true" styleClass="grid_3">
                        <f:convertDateTime pattern="dd/MM/yyyy"/>
                    </p:inputText>

                    <p:outputLabel value="Contrato Referência" styleClass="grid_6" for="contratoReferencia"/>
                    <p:inputText id="contratoReferencia" styleClass="grid_4 alpha" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.contratoReferencia}" />
                    <div class="clear"/>

                    <p:outputLabel value="Livro" styleClass="grid_3" for="livro"/>
                    <p:inputText id="livro" styleClass="grid_8" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.livro}" />

                    <p:outputLabel value="Folha" styleClass="grid_4 alpha" for="folha"/>
                    <p:inputText id="folha" styleClass="grid_8" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.folha}" />
                    <div class="clear"/>

                    <p:outputLabel value="Prefeito" styleClass="grid_3" for="prefeito"/>
                    <p:inputText id="prefeito" styleClass="grid_20" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.prefeito}" />
                    <div class="clear"/>

                    <p:outputLabel value="Secretário" styleClass="grid_3" for="secretario"/>
                    <p:inputText id="secretario" styleClass="grid_20" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.secretario}" />
                    <div class="clear"/>

                    <p:outputLabel value="Nº despacho" styleClass="grid_3" for="despachoNumero"/>
                    <p:inputText id="despachoNumero" styleClass="grid_8" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.despachoNumero}" />

                    <p:outputLabel value="Data despacho" styleClass="grid_4 alpha" for="despachoData"/>
                    <p:inputText id="despachoData" value="#{managerEditarAforamento.aforamento.despachoData}" 
                                 styleClass="grid_8" readonly="true">
                        <f:convertDateTime pattern="dd/MM/yyyy"/>
                    </p:inputText>
                    <div class="clear"/>

                    <p:outputLabel value="Nº petição" styleClass="grid_3" for="peticaoRequerimentoNumero"/>
                    <p:inputText id="peticaoRequerimentoNumero" styleClass="grid_8" readonly="true"
                                 value="#{managerEditarAforamento.aforamento.peticaoRequerimentoNumero}" />

                    <p:outputLabel value="Data petição" styleClass="grid_4 alpha" for="peticaoRequerimentoData"/>
                    <p:inputText id="peticaoRequerimentoData" value="#{managerEditarAforamento.aforamento.peticaoRequerimentoData}" 
                                 readonly="true" styleClass="grid_8">
                        <f:convertDateTime pattern="dd/MM/yyyy"/>
                    </p:inputText>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Foreiro</legend>

                        <p:dataTable id="foreirosTable" var="foreiro"
                                     value="#{managerEditarAforamento.aforamento.foreiros}"
                                     styleClass="grid_24" emptyMessage="Nenhum registro" rowIndexVar="idforeiro">  
                            <f:facet name="header">
                                Foreiro/Cidadão
                            </f:facet>

                            <p:column headerText="CPF" width="200" style="vertical-align: middle; text-align: center">
                                <h:outputText value="#{managerEditarAforamento.mascaraCpf(foreiro.cpf)}"/>
                            </p:column>

                            <p:column headerText="Nome" style="vertical-align: middle; text-align: center">
                                <h:outputText value="#{foreiro.nome}"/>
                            </p:column>
                        </p:dataTable>
                    </fieldset>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Endereço</legend>

                        <p:outputLabel value="Zona" styleClass="grid_3" for="zona"/>
                        <p:inputText id="zona" styleClass="grid_4" readonly="true"
                                     value="#{managerEditarAforamento.aforamento.zona.nome}"/>

                        <p:outputLabel value="Logradouro" styleClass="grid_3 alpha" style="width: 11.5%" for="endereco"/>
                        <p:inputText id="endereco" styleClass="grid_13" readonly="true"
                                     value="#{managerEditarAforamento.aforamento.endereco}" />
                    </fieldset>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Medida/Demarcação</legend>

                        <p:outputLabel value="Auto" styleClass="grid_3" for="auto"/>
                        <p:inputText id="auto" styleClass="grid_20" readonly="true"
                                     value="#{managerEditarAforamento.aforamento.autoMedicaoDemarcacao}" />
                        <div class="clear"/>

                        <p:outputLabel value="Livro" styleClass="grid_3" for="autoMedicaoDemarcacaoLivro"/>
                        <p:inputText id="autoMedicaoDemarcacaoLivro" styleClass="grid_8" readonly="true"
                                     value="#{managerEditarAforamento.aforamento.autoMedicaoDemarcacaoLivro}" />

                        <p:outputLabel value="Folha" styleClass="grid_4 alpha" for="autoMedicaoDemarcacaoFolha"/>
                        <p:inputText id="autoMedicaoDemarcacaoFolha" styleClass="grid_8" readonly="true"
                                     value="#{managerEditarAforamento.aforamento.autoMedicaoDemarcacaoFolha}" />
                    </fieldset>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Motivo do aforamento</legend>

                        <p:inputTextarea id="motivo" styleClass="grid_23" readonly="true"
                                         value="#{managerEditarAforamento.aforamento.motivo}" />
                    </fieldset>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Características</legend>

                        <p:inputTextarea id="caracteristicas" styleClass="grid_23" readonly="true"
                                         value="#{managerEditarAforamento.aforamento.caracteristicas}" />
                    </fieldset>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Observações</legend>

                        <p:inputTextarea id="observacao" styleClass="grid_23" readonly="true"
                                         value="#{managerEditarAforamento.aforamento.observacao}" />
                    </fieldset>
                    <div class="clear"/>

                    <fieldset>
                        <legend>Averbação</legend>

                        <p:dataTable id="averbacaoTable" var="averbacao"
                                     value="#{managerEditarAforamento.aforamento.averbacoes}"
                                     styleClass="grid_24" emptyMessage="Nenhum registro" rowIndexVar="idaverbacao">  
                            <f:facet name="header">
                                Averbação
                            </f:facet>

                            <p:column headerText="Ação" width="100" style="vertical-align: middle; text-align: center">
                                <p:commandButton title="Editar" update=":form:averbacaoTable, :dialogForm" 
                                                 process=":form:averbacaoTable" oncomplete="averbacaoDialog.show()"
                                                 actionListener="#{managerEditarAforamento.visualizarAverbacao(averbacao)}"
                                                 icon="ui-icon-search"/>
                            </p:column>

                            <p:column headerText="Tipo" style="vertical-align: middle; text-align: center">
                                <h:outputText value="#{averbacao.tipoAverbacao.nome}"/>
                            </p:column>

                            <p:column headerText="Data" style="vertical-align: middle; text-align: center">
                                <h:outputText value="#{averbacao.dataAverbacao}">
                                    <f:convertDateTime pattern="dd/MM/yyyy"/>
                                </h:outputText>
                            </p:column>

                        </p:dataTable>
                    </fieldset>

                    <h4 class="title">Anexos</h4>
                    <p:panel id="documentoPanel" styleClass="container_24 clearfix">

                        <fieldset>
                            <legend>Arquivos anexados</legend>

                            <div class="my-simple-gallery" data-pswp-uid="1">
                                <ui:repeat value="#{managerEditarAforamento.aforamento.anexos}" var="a">
                                    <div class="grid_3">
                                        <figure itemprop="associatedMedia" class="grid_24" onclick="initPhoto(); desabilitaEdicaoImagem();">
                                            <a href="#{managerImagem.urlImagem(a)}" 
                                               itemprop="contentUrl" data-size="#{managerImagem.widthHeight(a)}" pid="#{a.id}">
                                                <img src="#{managerImagem.urlThumbnailImagem(a)}" 
                                                     itemprop="thumbnail" class="image"/>
                                            </a>
                                            <figcaption itemprop="caption description">#{a.nomeExibicao}</figcaption>
                                        </figure>
                                    </div>
                                </ui:repeat>
                            </div>

                            <ui:repeat  value="#{managerEditarAforamento.aforamento.anexos}" var="a" rendered="false">
                                <p:panel styleClass="grid_4 withoutBorder" >
                                    <h:outputLink  
                                        value="#{a.tipo ne 'application/pdf' ? 'viewImage.xhtml':'show'}" title="#{a.nomeExibicao}"  target="_blank" >

                                        <div style="width: 100%;" class="grid_4">

                                            <p:graphicImage styleClass="image grid_3" rendered="#{managerImagem.imagem(a)}"
                                                            style="margin-left:1%; width: 100px;"
                                                            url="#{managerImagem.urlThumbnailImagem(a)}" />

                                            <p:outputLabel  value="#{managerImagem.nomeAnexo(a)}" 
                                                            style="margin-left:1%; width: 100px;" rendered="#{managerImagem.imagem(a)}"/>

                                            <p:graphicImage styleClass="image grid_3" rendered="#{managerImagem.PDF(a)}"
                                                            style="margin-left:1%; width: 100px;" 
                                                            url="#{managerImagem.urlPDF}" />

                                            <p:outputLabel  value="#{managerImagem.nomeAnexoPdf(a)}" 
                                                            style="margin-left:1%; width: 100px;" rendered="#{managerImagem.PDF(a)}"/>
                                        </div>
                                        <f:param name="annex" value="#{managerImagem.urlVisualziarImagem(a)}"/>
                                    </h:outputLink>

                                </p:panel>
                            </ui:repeat>
                        </fieldset>
                    </p:panel>

                    <div class="buttonAction">
                        <p:button href="pesquisaraforamento.xhtml" value="Voltar" icon="ui-icon-arrowreturnthick-1-w" />
                    </div >
                </p:panel>

            </h:form>

            <h:form id="dialogForm" enctype="multipart/form-data">
                <p:dialog id="averbacaoDialog" width="1024" height="500" widgetVar="averbacaoDialog" modal="true" 
                          styleClass="container_24 clearfix" closable="false" resizable="false" closeOnEscape="true" >

                    <p:panel id="averbacaoPanel" styleClass="container_24 clearfix withoutBorder">
                        <fieldset>
                            <legend>Dados gerais</legend>

                            <p:outputLabel value="Tipo" styleClass="grid_3" for="tipoAverbacao" />
                            <p:inputText id="tipoAverbacao" styleClass="grid_8" value="#{managerEditarAforamento.averbacao.tipoAverbacao.nome}" readonly="true"/>

                            <p:outputLabel value="Data da carta" styleClass="grid_4 alpha" for="dataAverbacao"/>
                            <p:inputText id="dataAverbacao" value="#{managerEditarAforamento.averbacao.dataAverbacao}"
                                         styleClass="grid_8" readonly="true">
                                <f:convertDateTime pattern="dd/MM/yyyy"/>
                            </p:inputText>
                            <div class="clear"/>

                            <p:outputLabel value="Descrição" styleClass="grid_3" for="descricao"/>
                            <p:inputTextarea id="descricao" styleClass="grid_20" value="#{managerEditarAforamento.averbacao.descricao}" 
                                             style="max-height: 68px"  readonly="true"/>
                            <div class="clear"/>

                            <p:outputLabel value="Nº despacho" styleClass="grid_3" for="despachoNumero"/>
                            <p:inputText id="despachoNumero" styleClass="grid_8" value="#{managerEditarAforamento.aforamento.despachoNumero}" 
                                         readonly="true"/>

                            <p:outputLabel value="Data despacho" styleClass="grid_4 alpha" for="despachoData"/>
                            <p:inputText id="despachoData" value="#{managerEditarAforamento.averbacao.despachoData}" 
                                         readonly="true" styleClass="grid_8">
                                <f:convertDateTime pattern="dd/MM/yyyy"/>
                            </p:inputText>
                            <div class="clear"/>

                            <p:outputLabel value="Nº petição / requerimento" styleClass="grid_3" for="peticaoRequerimentoNumero"/>
                            <p:inputText id="peticaoRequerimentoNumero" styleClass="grid_8" readonly="true"
                                         value="#{managerEditarAforamento.averbacao.peticaoRequerimentoNumero}" />

                            <p:outputLabel value="Data petição / requerimento" styleClass="grid_4 alpha" for="peticaoRequerimentoData"/>
                            <p:inputText id="peticaoRequerimentoData" value="#{managerEditarAforamento.averbacao.peticaoRequerimentoData}" 
                                         readonly="true" styleClass="grid_8">
                                <f:convertDateTime parent="dd/MM/yyyy"/>
                            </p:inputText>
                            <div class="clear"/>
                        </fieldset>

                        <fieldset>
                            <legend>Medida/Demarcação</legend>

                            <p:outputLabel value="Auto" styleClass="grid_3" for="auto"/>
                            <p:inputText id="auto" styleClass="grid_14" readonly="true"
                                         value="#{managerEditarAforamento.averbacao.autoMedicaoDemarcacao}" />

                            <p:outputLabel value="Data" styleClass="grid_3 alpha" for="autoMedicaoDemarcacaoData"/>
                            <p:inputText id="autoMedicaoDemarcacaoData" value="#{managerEditarAforamento.averbacao.autoMedicaoDemarcacaoData}" 
                                         readonly="true" styleClass="grid_3">
                                <f:convertDateTime parent="dd/MM/yyyy"/>
                            </p:inputText>
                            <div class="clear"/>

                            <p:outputLabel value="Livro" styleClass="grid_3" for="autoMedicaoDemarcacaoLivro"/>
                            <p:inputText id="autoMedicaoDemarcacaoLivro" styleClass="grid_8"  readonly="true"
                                         value="#{managerEditarAforamento.averbacao.autoMedicaoDemarcacaoLivro}" />

                            <p:outputLabel value="Folha" styleClass="grid_4 alpha" for="autoMedicaoDemarcacaoFolha"/>
                            <p:inputText id="autoMedicaoDemarcacaoFolha" styleClass="grid_8"  readonly="true"
                                         value="#{managerEditarAforamento.averbacao.autoMedicaoDemarcacaoFolha}" />
                        </fieldset>

                        <fieldset><legend>Cofrontações</legend>
                            <p:panel styleClass="container_24 clearfix withoutBorder">

                                <fieldset><legend>Frente</legend>
                                    <p:outputLabel value="Para" styleClass="grid_3" for="frenteInputText" />
                                    <p:inputText id="frenteInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.frente}" />
                                    <div class="clear"/>

                                    <p:outputLabel value="Limitando" styleClass="grid_3 dimensaoLabelImovel" for="frenteRuaInputText" />
                                    <p:inputText id="frenteRuaInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.frenteRua}" />

                                    <div class="clear"/>
                                    <p:outputLabel value="Medindo" styleClass="grid_3 dimensaoLabelImovel" for="frenteMedInputText" />
                                    <p:inputText id="frenteMedInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.frenteMedindo}" />
                                </fieldset>

                                <fieldset><legend>Fundo</legend>
                                    <p:outputLabel value="Para" styleClass="grid_3" for="fundoInputText" />
                                    <p:inputText id="fundoInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.fundo}" />
                                    <div class="clear"/>

                                    <p:outputLabel value="Limitando" styleClass="grid_3 dimensaoLabelImovel" for="fundoRuaInputText" />
                                    <p:inputText id="fundoRuaInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.fundoRua}" />

                                    <div class="clear"/>
                                    <p:outputLabel value="Medindo" styleClass="grid_3 dimensaoLabelImovel" for="fundoMedindoInputText" />
                                    <p:inputText id="fundoMedindoInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.fundoMedindo}" />
                                </fieldset>

                                <fieldset><legend>Lado esquerdo</legend>
                                    <p:outputLabel value="Para" styleClass="grid_3" for="ladoEsquerdoInputText" />
                                    <p:inputText id="ladoEsquerdoInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.ladoEsquerdo}" />
                                    <div class="clear"/>

                                    <p:outputLabel value="Limitando" styleClass="grid_3 dimensaoLabelImovel" for="ladoEsquerdoRuaInputText" />
                                    <p:inputText id="ladoEsquerdoRuaInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.ladoEsquerdoRua}" />

                                    <div class="clear"/>
                                    <p:outputLabel value="Medindo" styleClass="grid_3 dimensaoLabelImovel" for="ladoEsquerdoMedindoInputText" />
                                    <p:inputText id="ladoEsquerdoMedindoInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.ladoEsquerdoMedindo}" />
                                </fieldset>

                                <fieldset><legend>Lado direito</legend>
                                    <p:outputLabel value="Para" styleClass="grid_3" for="ladoDireitoInputText" />
                                    <p:inputText id="ladoDireitoInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.ladoDireito}" />
                                    <div class="clear"/>

                                    <p:outputLabel value="Limitando" styleClass="grid_3 dimensaoLabelImovel" for="ladoDireitoRuaInputText" />
                                    <p:inputText id="ladoDireitoRuaInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.ladoDireitoRua}" />

                                    <div class="clear"/>
                                    <p:outputLabel value="Medindo" styleClass="grid_3 dimensaoLabelImovel" for="ladoDireitoMedindoInputText" />
                                    <p:inputText id="ladoDireitoMedindoInputText" styleClass="grid_20" readonly="true"
                                                 value="#{managerEditarAforamento.averbacao.ladoDireitoMedindo}" />
                                </fieldset>
                            </p:panel>
                        </fieldset>

                        <fieldset><legend>Dimensões</legend>
                            <p:panel styleClass="container_24 clearfix withoutBorder">

                                <div class="clear"/>
                                <p:outputLabel value="Frente" styleClass="grid_3" for="frenteTotalInputText" />
                                <p:inputText id="frenteTotalInputText" styleClass="grid_4" readonly="true"
                                             value="#{managerEditarAforamento.averbacao.frenteTotal}"
                                             onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ',', aSign:' m', pSign:'s'} );">
                                    <f:convertNumber pattern="#,###,##0.00" locale="pt,BR"/>
                                </p:inputText>

                                <p:outputLabel value="Fundo" styleClass="grid_3" for="fundoTotalInputText" />
                                <p:inputText id="fundoTotalInputText" styleClass="grid_4" readonly="true"
                                             value="#{managerEditarAforamento.averbacao.fundoTotal}"
                                             onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ',', aSign:' m', pSign:'s'} );">
                                    <f:convertNumber pattern="#,###,##0.00" locale="pt,BR"/>
                                </p:inputText>

                                <p:outputLabel value="Área Total" styleClass="grid_3" for="areaTInputText" />
                                <p:inputText id="areaTInputText" styleClass="grid_4" readonly="true"
                                             value="#{managerEditarAforamento.averbacao.areaTotal}"
                                             onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ',', aSign:' m²', pSign:'s'} );">
                                    <f:convertNumber pattern="#,###,##0.00" locale="pt,BR"/>
                                </p:inputText>

                            </p:panel>
                        </fieldset>
                        <div class="clear"/><br/>

                        <div class="buttonAction">
                            <p:commandButton value="Fechar" icon="ui-icon-close" oncomplete="averbacaoDialog.hide()" />
                        </div>
                    </p:panel>
                </p:dialog>
            </h:form>
        </ui:define> 
    </ui:composition>

</html>
